<%@ page language="java" contentType="text/html; charset=UTF-8"
	pageEncoding="UTF-8"%>
<%@taglib uri="http://java.sun.com/jsp/jstl/core" prefix="c"%>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>滨海基金 -客户列表</title>
<link href="css/bootstrap.min.css" rel="stylesheet">
<link href="css/font-awesome.min.css" rel="stylesheet">
<!-- Data Tables -->
<link href="css/plugins/dataTables/dataTables.bootstrap.css"
	rel="stylesheet">
<link href="css/animate.min.css" rel="stylesheet">
<link href="css/style.min.css" rel="stylesheet">
<link href="css/plugins/sweetalert/sweetalert.css" rel="stylesheet">
<link href="css/jquery.searchableSelect.css" rel="stylesheet">

<script src="js/plugins/sweetalert/sweetalert.min.js"></script>
<script src="js/jquery.min.js"></script>
<script src="js/bootstrap.min.js"></script>
<script src="js/plugins/jeditable/jquery.jeditable.js"></script>
<script src="js/plugins/dataTables/jquery.dataTables.js"></script>
<script src="js/plugins/dataTables/dataTables.bootstrap.js"></script>
<script type="text/javascript"
	src="http://tajs.qq.com/stats?sId=9051096" charset="UTF-8"></script>
<script src="js/jquery.searchableSelect.js"></script>
<script src="js/common.js"></script>
</head>
<style type="text/css">
/* dataTables列内容居中 */
.table>tbody>tr>td {
	text-align: center;
}
/* dataTables表头居中 */
.table>thead:first-child>tr:first-child>th {
	text-align: center;
}

#sel>select {
	width: 200px;
	height: 35px;
	float: left;
	margin-right:5px;
}
#sel>select:last-child{
	margin-right:0;
}
#sel {
	/* width: 100%; */
	height: 50px;
	padding: 5px;
}
</style>
<body class="gray-bg">
	<div class="row">
		<div class="col-sm-12">
			<div class="ibox float-e-margins">
				<div class="ibox-title">
					<h5>
						员工 <small>列表,信息</small>
					</h5>
					<div class="ibox-content">
						<div class="col-md-12" style="padding-left:0;">
							<div class="col-md-5" id="sel" style="width:520px;">
								<input type="hidden" id="userBranchId"
									value="${loginUser.branch.branchId }" /> <input type="hidden"
									id="userTeamId" value="${loginUser.team.branchId }" /> <input
									type="hidden" id="userQuarters" value="${loginUser.quarters }" />
								<select class="form-control" style="width: 200px" id="company"
									onchange="cpmpanyChage(this.value)">
								</select> <select class="form-control" style="width: 150px" id="branch"
									onchange="branchChage(this.value)">
									<option value="">-请选择-</option>
								</select> <select class="form-control" style="width: 150px"
									onchange="Search()" id="team" onchange="">
									<option value="">-请选择-</option>
								</select>
							</div>
							<div class="input-group col-md-3"
								style="margin-top: 5px; position: relative; width: 300px; float: left;">
								<input id="employeeName" type="text" class="form-control "
									placeholder="请输入关键字（名称）"/ > <span
									class="input-group-btn">
									<button onclick="Search()" class="btn btn-info btn-search">查询</button>
								</span>
							</div>
						</div>
						<table
							class="table table-striped table-bordered table-hover dataTables-example"
							id="dataTables-example">
							<thead>
								<tr style="height: 30px">
									<th style="width: 70px" align="center">序号</th>
									<th style="width: 140px" align="center">名称</th>
									<th style="width: 100px" align="center">性别</th>
									<th style="width: 120px" align="center">职务</th>
									<th style="width: 100px" align="center">客户数量</th>
									<th style="width: 100px" align="center">拜访次数</th>
									<th style="width: 100px" align="center">跟进次数</th>
									<th style="width: 300px" align="center">操作</th>
								</tr>
							</thead>
						</table>
					</div>
				</div>
			</div>
		</div>
	</div>
	<!-- 移交客户 -->
	<div class="modal fade  " id='addRoleModal'>
		<div class="modal-dialog" style="width: 900px; height: 600px;">
			<div class="modal-content">
				<div class="modal-header">
					<button class="close" data-dismiss='modal'>×</button>

					<h2 class="modal-title" align="center">移交客户</h2>
				</div>
				<div
					style="margin: 0px auto; padding-left: 30px; width: 100%; height: 34px; position: relative; top: 10px;">
					<span style="line-height: 34px; float: left;">接收人：</span><select
						id="personLiable" class="form-control chosen-select"
						style="width: 200px; float: left;z-index: 10;" tabindex="2"
						name="personLiable"></select><img alt="" id="loadDevo" style="float: left;margin-left: 5px;margin-top: 10px;" src="img/loading-upload.gif">
				</div>

				<div class="modal-body" align="center">
					<div class="ibox-content">
						<div class="input-group col-md-5"
							style="margin-top: 0px; positon: relative; float: left; bottom: -20px;">
							<input id="customerName" type="text" class="form-control "
								placeholder="请输入关键字（名称）"/ > <span
								class="input-group-btn"> <input type="hidden"
								id="customerId">

								<button onclick="Search4()" class="btn btn-info btn-search">查询</button>
							</span>
						</div>
						<table
							class="table table-striped table-bordered table-hover dataTables-example"
							id="dataTables-example4">
							<thead>
								<tr style="height: 30px;">
									<th style="width: 50px" align="center">序号</th>
									<th style="width: 140px" align="center">名称</th>
									<th style="width: 100px" align="center">性别</th>
									<th style="width: 120px" align="center">客户类型</th>
									<th style="width: 150px" align="center">职业</th>
									<th style="width: 180px" align="center">电话</th>
									<th style="width: 100px" align="center">全选<input
										type="checkbox" id="benCheck" /></th>
								</tr>
							</thead>
						</table>
					</div>
				</div>
				<div class="modal-footer" align="center">
					<div align="center">
						<button class="btn btn-primary" id="btnAdd">确认</button>
					</div>
				</div>
			</div>
		</div>
	</div>
	<script type="text/javascript">
		var table;
		var table4;
		$(function() {
			//提示信息
			var lang = {
				"sProcessing" : "<div style=\"float:right;width:50%\" >处理中...</div>",
				"sLengthMenu" : "每页 _MENU_ 项",
				"sZeroRecords" : "没有匹配结果",
				"sInfo" : "当前显示第 _START_ 至 _END_ 项，共 _TOTAL_ 项。",
				"sInfoEmpty" : "当前显示第 0 至 0 项，共 0 项",
				"sInfoFiltered" : "(由 _MAX_ 项结果过滤)",
				"sInfoPostFix" : "",
				"sSearch" : "搜索:",
				"sUrl" : "",
				"sEmptyTable" : "表中数据为空",
				"sLoadingRecords" : "载入中...",
				"sInfoThousands" : ",",
				"oPaginate" : {
					"sFirst" : "首页",
					"sPrevious" : "上页",
					"sNext" : "下页",
					"sLast" : "末页",
					"sJump" : "跳转"
				},
				"oAria" : {
					"sSortAscending" : ": 以升序排列此列",
					"sSortDescending" : ": 以降序排列此列"
				}
			};
			var lang4 = {
				"sProcessing" : "<div style=\"float:left;width:900px;\" >处理中...</div>",
				"sLengthMenu" : "每页 _MENU_ 项",
				"sZeroRecords" : "没有匹配结果",
				"sInfo" : "当前显示第 _START_ 至 _END_ 项，共 _TOTAL_ 项。",
				"sInfoEmpty" : "当前显示第 0 至 0 项，共 0 项",
				"sInfoFiltered" : "(由 _MAX_ 项结果过滤)",
				"sInfoPostFix" : "",
				"sSearch" : "搜索:",
				"sUrl" : "",
				"sEmptyTable" : "表中数据为空",
				"sLoadingRecords" : "载入中...",
				"sInfoThousands" : ",",
				"oPaginate" : {
					"sFirst" : "首页",
					"sPrevious" : "上页",
					"sNext" : "下页",
					"sLast" : "末页",
					"sJump" : "跳转"
				},
				"oAria" : {
					"sSortAscending" : ": 以升序排列此列",
					"sSortDescending" : ": 以降序排列此列"
				}
			};
			//初始化表格
			table = $("#dataTables-example")
					.dataTable(
							{

								"fnDrawCallback" : function() {
									var api = this.api();
									var startIndex = api.context[0]._iDisplayStart;//获取到本页开始的条数
									api.column(0).nodes().each(
											function(cell, i) {
												cell.innerHTML = startIndex + i
														+ 1;
											});
								},
								language : lang, //提示信息
								autoWidth : false, //禁用自动调整列宽
								stripeClasses : [ "odd", "even" ], //为奇偶行加上样式，兼容不支持CSS伪类的场合
								processing : true, //隐藏加载提示,自行处理
								serverSide : true, //启用服务器端分页
								searching : false, //禁用原生搜索
								orderMulti : false, //启用多列排序
								order : [], //取消默认排序查询,否则复选框一列会出现小箭头
								renderer : "bootstrap", //渲染样式：Bootstrap和jquery-ui
								pagingType : "simple_numbers", //分页样式：simple,simple_numbers,full,full_numbers
								"aLengthMenu" : [ 10 ],
								"bLengthChange" : false,//隐藏分页数量选择框
								ordering : false, //关闭排序图标
								ajax : function(data, callback, settings) {
									//封装请求参数
									var param = {};
									param.limit = data.length;//页面显示记录条数，在页面显示每页显示多少项的时候
									param.start = data.start;//开始的记录序号
									param.page = (data.start / data.length) + 1;//当前页码
									//param.darw=darw;  //计数器
									var employeeName = $("#employeeName").val();
									if (employeeName != null
											&& employeeName != "") {
										param.employeeName = employeeName
									}
									var deptId;
									var branchId;
									var teamId;

									if ($("#company>option:selected").val() != "") {
										deptId = $("#company>option:selected")
												.val();
									}

									if ($("#branch>option:selected").val() != "") {
										branchId = $("#branch>option:selected")
												.val();
									}
									if ($("#team>option:selected").val() != "") {
										teamId = $("#team>option:selected")
												.val();
									}
									param.deptId = deptId;
									param.branchId = branchId;
									param.teamId = teamId;

									//console.log(param);
									//ajax请求数据
									$
											.ajax({
												type : "POST",
												url : "queryEmployeeCustomerNumberByDeptId.do",
												cache : false, //禁用缓存
												data : param, //传入组装的参数
												dataType : "json",
												success : function(result) {

													//console.log(result);
													//setTimeout仅为测试延迟效果
													setTimeout(
															function() {
																//封装返回数据
																var returnData = {};
																draw = result.draw;//后台返回的计数器
																returnData.draw = data.draw;//这里直接自行返回了draw计数器,应该由后台返回
																returnData.recordsTotal = result.total;//返回数据全部记录
																returnData.recordsFiltered = result.total;//后台不实现过滤功能，每次查询均视作全部结果
																returnData.data = result.data;//返回的数据列表

																//console.log(returnData);
																//调用DataTables提供的callback方法，代表数据已封装完成并传回DataTables进行渲染
																//此时的数据需确保正确无误，异常判断应在执行此回调前自行处理完毕
																callback(returnData);
															}, 200);
												}
											});
								},
								//列表表头字段
								columns : [ {
									"data" : null
								}, {
									"data" : "name"
								}, {
									"data" : "sex"
								}, {
									"data" : "position"
								}, {
									"data" : "customerNumber"
								}, {
									"data" : "visitNumber"
								}, {
									"data" : "followNumber"
								}
								],
								columnDefs : [ {
									"targets" : [ 7 ], //第七列加一条 自定义列
									"data" : "employeeId", //数据列名
									"render" : function(data, type, full) { //返回自定义的内容
										var user="${sessionScope.loginUser.quarters}"; 
										var text="<a class=\"btn btn-info btn-xs\" href=\"toReserveEmployeeList.do?userId="
											+ data
											+ "\">预约</a> "
											+ "<a class=\"btn btn-info btn-xs\" href=\"toEmployeeVisit.do?id="
											+ data
											+ "\">拜访</a> "
											+ "<a class=\"btn btn-info btn-xs\" href=\"toEmployeeFollow.do?id="
											+ data
											+ "\">跟进</a> "
											+ "<a class=\"btn btn-info btn-xs\" href=\"toEmployeeContract.do?id="
											+ data
											+ "\">合同</a> "
											+ "<a class=\"btn btn-info btn-xs\" href=\"toEmployeeEraning.do?id="
											+ data
											+ "\">回款</a> "
											+ "<a class=\"btn btn-info btn-xs\" href=\"toEmployeeReturn.do?id="
											+ data
											+ "\">回访</a> ";
											if(user==1 || user==2 || user==3){
												text+= "<a class=\"btn btn-warning  btn-xs\" onclick=\"devolveon('"+ data + "')\">移交</a>";
											}
										return text;
									}
								} ]
							})//.api();		
			// 初始化表格
			table4 = $("#dataTables-example4")
					.dataTable(
							{

								"fnDrawCallback" : function() {
									var api = this.api();
									var startIndex = api.context[0]._iDisplayStart;// 获取到本页开始的条数
									api.column(0).nodes().each(
											function(cell, i) {
												cell.innerHTML = startIndex + i
														+ 1;
											});
								},
								language : lang4, // 提示信息
								autoWidth : false, // 禁用自动调整列宽
								stripeClasses : [ "odd", "even" ], // 为奇偶行加上样式，兼容不支持CSS伪类的场合
								processing : true, // 隐藏加载提示,自行处理
								serverSide : true, // 启用服务器端分页
								searching : false, // 禁用原生搜索
								orderMulti : false, // 启用多列排序
								order : [], // 取消默认排序查询,否则复选框一列会出现小箭头
								renderer : "bootstrap", // 渲染样式：Bootstrap和jquery-ui
								pagingType : "simple_numbers", // 分页样式：simple,simple_numbers,full,full_numbers
								"aLengthMenu" : [ 10 ],
								"bLengthChange" : false,// 屏蔽tables的一页展示多少条记录的下拉列表
								ordering : false, // 关闭排序图标
								ajax : function(data, callback, settings) {
									// 封装请求参数
									var param = {};
									param.limit = data.length;// 页面显示记录条数，在页面显示每页显示多少项的时候
									param.start = data.start;// 开始的记录序号
									param.page = (data.start / data.length) + 1;// 当前页码
									// param.darw=darw; //计数器
									var customerName = $("#customerName").val()
											.trim();
									if (customerName != null
											&& customerName != "") {
										param.customerName = customerName
									}
									param.personLiable = $("#customerId").val();
									// console.log(param);
									// ajax请求数据
									$
											.ajax({
												type : "POST",
												url : "customerList.do",
												cache : false, // 禁用缓存
												data : param, // 传入组装的参数
												dataType : "json",
												success : function(result) {

													// console.log(result);
													// setTimeout仅为测试延迟效果
													setTimeout(
															function() {
																// 封装返回数据
																var returnData = {};
																draw = result.draw;// 后台返回的计数器
																returnData.draw = data.draw;// 这里直接自行返回了draw计数器,应该由后台返回
																returnData.recordsTotal = result.total;// 返回数据全部记录
																returnData.recordsFiltered = result.total;// 后台不实现过滤功能，每次查询均视作全部结果
																returnData.data = result.data;// 返回的数据列表
																$("#benCheck")
																		.removeAttr(
																				"checked");
																// console.log(returnData);
																// 调用DataTables提供的callback方法，代表数据已封装完成并传回DataTables进行渲染
																// 此时的数据需确保正确无误，异常判断应在执行此回调前自行处理完毕
																callback(returnData);
															}, 200);
												}
											});
								},
								// 列表表头字段
								columns : [ {
									"data" : null
								}, {
									"data" : "customerName"
								}, {
									"data" : "sex"
								}, {
									"data" : function(data) {
										if (data.customerType == 0) {
											return "自然人";
										} else if (data.customerType == 1) {
											return "老总";
										} else if (data.customerType == 2) {
											return "部门经理";
										} else if (data.customerType == 3) {
											return "部门主管";
										} else if (data.customerType == 4) {
											return "普通员工";
										} else if (data.customerType == 5) {
											return "法人";
										}
									}
								}, {
									"data" : "profession"
								}, {
									"data" : "mobileNumber"
								}

								],
								columnDefs : [ {
									"targets" : [ 6 ], // 第七列加一条 自定义列
									"data" : "customerId", // 数据列名
									"render" : function(data, type, full) { // 返回自定义的内容editCustomer

										return "<input type=\"checkbox\" name='transferCustomers' value=\""
															+ data + "\" />";
									}
								} ]
							})// .api();

			$("#btnAdd")
					.click(
							function() {
								var personLiable = $("#personLiable").val();
								var text = $(
										"input:checkbox[name='transferCustomers']:checked")
										.map(function(index, elem) {
											return $(elem).val();
										}).get().join(',');
								if (personLiable == "") {
									swal("提示!", "请选择接收人!", "error");
									return;
								}
								if (text == "") {
									swal("提示!", "请选择移交客户!", "error");
									return;
								}
								$
										.ajax({
											url : "transferCustomerAdmin.do",
											type : "post",
											data : {
												customerText : text,
												personLiable : personLiable
											},
											dataType : "json",
											success : function(result) {
												if (result.code == 1) {
													swal(
															{
																title : "提示",
																text : "移交成功！",
																type : "success",
																confirmButtonText : "确定"
															}, function() {
																Search4();
																Search();
															});

												} else if (result.code == 0) {
													sweetAlert("异常", "暂无数据!",
															"error");
												} else {
													sweetAlert("异常", "出现未知错误!",
															"error");
												}

											},
											error : function() {
												sweetAlert("异常", "网络出现异常!",
														"error");
											}

										});// ajax end;
							});
			// 全选事件
			$("#benCheck").click(
					function() {
						if ($('#benCheck').is(':checked')) {
							$("input:checkbox[name='transferCustomers']").prop(
									"checked", "checked");
						} else {
							$("input:checkbox[name='transferCustomers']")
									.removeAttr("checked");
						}
					});
			cpmpanyDept();
			loadDevolven();//加载可移交客户的用户信息
		})
		function Search() {
			/* var oSettings = table.fnSettings();  
			oSettings._iDisplayStart = 0;  
			table.fnDraw(oSettings);   */
			table.fnDraw();
		}
		function Search4() {
			/* var oSettings = table.fnSettings();  
			oSettings._iDisplayStart = 0;  
			table.fnDraw(oSettings);   */
			table4.fnDraw();
		}
		function cpmpanyDept() {
			$
					.ajax({
						url : "getDeptInfo.do",
						type : "post",
						dataType : "json",
						success : function(result) {
							if (result.code == 0) {
								var branchHtml = "";
								if (result.quarters == 5
										|| result.quarters == 6) {
									branchHtml += "<option value=\"\" >-全部分公司-</option>";
								}
								for (var i = 0; i < result.data.length; i++) {
									branchHtml += "<option value=\""
									+ result.data[i].deptId + "\">"
											+ result.data[i].deptName
											+ "("
											+ result.data[i].remake
											+ ")</option>";
								}
								$("#company").append(branchHtml);
								$("#company").trigger("change");

							} else {
								sweetAlert("提示", "操作失败,请刷新后重试!", "error");
							}
						},
						error : function() {
							sweetAlert("异常", "网络出现异常!", "error");
						}
					});// ajax end;
		}
		function cpmpanyChage(id) {
			if ($("#company").val() != "" && $("#company").val() != null) {
				$
						.ajax({
							url : "getBranchInfo.do",
							type : "post",
							data : {
								id : id
							},
							dataType : "json",
							success : function(result) {
								if (result.code == 0) {
									var branchHtml = "";
									if (result.quarters != 2
											&& result.quarters != 1) {
										branchHtml += "<option value=\"\" >-请选择-</option>";
									}
									for (var i = 0; i < result.branch.length; i++) {
										branchHtml += "<option value=\""
										+ result.branch[i].branchId + "\">"
												+ result.branch[i].branchName
												+ "</option>";
									}
									$("#branch").empty();
									$("#branch").append(branchHtml);
									$("#branch").trigger("change");
								} else {
									sweetAlert("提示", "未知异常!", "error");
								}
							},
							error : function() {
								sweetAlert("异常", "网络出现异常!", "error");
							}
						});// ajax end;
			} else {
				$("#branch").empty();
				$("#branch").append("<option value=\"\" >-请选择-</option>");
				$("#branch").trigger("change");
			}

		}
		function branchChage(id) {
			if ($("#branch").val() != "" && $("#branch").val() != null) {
				$
						.ajax({
							url : "getTeamInfo.do",
							type : "post",
							data : {
								id : id
							},
							dataType : "json",
							success : function(result) {
								if (result.code == 0) {
									var branchHtml = "";
									if (result.quarters != 1) {
										branchHtml += "<option value=\"\" >-请选择-</option>";
									}
									for (var i = 0; i < result.data.length; i++) {
										branchHtml += "<option value=\""
										+ result.data[i].branchId + "\">"
												+ result.data[i].branchName
												+ "</option>";
									}
									$("#team").empty();
									$("#team").append(branchHtml);
									Search();
								} else {
									sweetAlert("提示", "未知异常!", "error");
								}
							},
							error : function() {
								sweetAlert("异常", "网络出现异常!", "error");
							}
						});// ajax end;
			} else {
				$("#team").empty();
				$("#team").append("<option value=\"\" >-请选择-</option>");
				Search();
			}

		}
		function devolveon(id) {
			$("#addRoleModal").modal("show");
			$("#customerId").val(id);
			Search4();
			//$("#personLiable").empty();
		}
		function loadDevolven(){
			//请求员工数据
			$.ajax({
				url : "askEmployee.do",
				type : "post",
				dataType : "json",
				success : function(result) {
					if (result.code == 1) {
						var emp = result.data;
						for (var i = 0; i < emp.length; i++) {
							$("#personLiable").append(
									"<option value="+emp[i].employeeId+" >"
											+ emp[i].name + "</option>");
						}
						$("#personLiable").searchableSelect();
						$("#loadDevo").hide();
						
					} else {
						sweetAlert("异常", "请求数据失败!", "error");
					}

				},
				error : function() {
					sweetAlert("异常", "网络出现异常!", "error");
				}

			});// ajax end;
		}
	</script>
</body>

</html>